{% extends 'base.html' %}
{% block head %}
  <title>各省平均月薪分布地图</title>
  <script type="text/javascript" src="https://assets.pyecharts.org/assets/echarts.min.js"></script>
{% endblock %}
{% block content %}

  <div id="c1a8906272f24c63bdc605afc19b3c61" class="chart-container" style="width:900px; height:500px;"></div>
  <script>
      var chart_c1a8906272f24c63bdc605afc19b3c61 = echarts.init(
          document.getElementById('c1a8906272f24c63bdc605afc19b3c61'), 'white', {renderer: 'canvas'});
      var option_c1a8906272f24c63bdc605afc19b3c61 = {
          "animation": true,
          "animationThreshold": 2000,
          "animationDuration": 1000,
          "animationEasing": "cubicOut",
          "animationDelay": 0,
          "animationDurationUpdate": 300,
          "animationEasingUpdate": "cubicOut",
          "animationDelayUpdate": 0,
          "color": [
              "#c23531",
              "#2f4554",
              "#61a0a8",
              "#d48265",
              "#749f83",
              "#ca8622",
              "#bda29a",
              "#6e7074",
              "#546570",
              "#c4ccd3",
              "#f05b72",
              "#ef5b9c",
              "#f47920",
              "#905a3d",
              "#fab27b",
              "#2a5caa",
              "#444693",
              "#726930",
              "#b2d235",
              "#6d8346",
              "#ac6767",
              "#1d953f",
              "#6950a1",
              "#918597"
          ],
          "series": [
              {
                  "type": "bar",
                  "name": "\u5929\u6d25\u5e02",
                  "legendHoverLink": true,
                  "data": [
                      35445.1,
                      14055.5,
                      34978.6,
                      16961.6,
                      17212.5,
                      24855.3,
                      11726.8,
                      13544.4,
                      37987.6,
                      98656.8,
                      62462.0,
                      36845.5,
                      42326.6,
                      24667.3,
                      70540.5,
                      53717.8,
                      45429.0,
                      39894.1,
                      107986.9,
                      21237.1,
                      5330.8,
                      23605.8,
                      46363.8,
                      16769.3,
                      23223.8,
                      1697.8,
                      25793.2,
                      8718.3,
                      2941.1,
                      3748.5,
                      13597.1
                  ],
                  "showBackground": false,
                  "barMinHeight": 0,
                  "barCategoryGap": "20%",
                  "barGap": "30%",
                  "large": false,
                  "largeThreshold": 400,
                  "seriesLayoutBy": "column",
                  "datasetIndex": 0,
                  "clip": true,
                  "zlevel": 0,
                  "z": 2,
                  "label": {
                      "show": true,
                      "position": "top",
                      "margin": 8
                  },
                  "itemStyle": {
                      "color": function (params) {
                          if (params.value < 3000) return '#66cc98'; else return '#009999';
                      }
                  }
              },
              {
                  "type": "line",
                  "name": "\u5929\u6d25\u5e02",
                  "connectNulls": false,
                  "symbolSize": 4,
                  "showSymbol": true,
                  "smooth": false,
                  "clip": true,
                  "step": false,
                  "data": [
                      [
                          "\u7b2c2019\u5e74",
                          35445.1
                      ],
                      [
                          "2018\u5e74",
                          14055.5
                      ],
                      [
                          "2017\u5e74",
                          34978.6
                      ],
                      [
                          "2016\u5e74",
                          16961.6
                      ],
                      [
                          "2015\u5e74",
                          17212.5
                      ],
                      [
                          "2014\u5e74",
                          24855.3
                      ]
                  ],
                  "hoverAnimation": true,
                  "label": {
                      "show": false,
                      "position": "top",
                      "margin": 8
                  },
                  "lineStyle": {
                      "show": true,
                      "width": 1,
                      "opacity": 1,
                      "curveness": 0,
                      "type": "solid"
                  },
                  "areaStyle": {
                      "opacity": 0
                  },
                  "zlevel": 0,
                  "z": 0,
                  "rippleEffect": {
                      "show": true,
                      "brushType": "stroke",
                      "scale": 2.5,
                      "period": 4
                  }
              }
          ],
          "legend": [
              {
                  "data": [
                      "\u5929\u6d25\u5e02",
                      "\u5929\u6d25\u5e02"
                  ],
                  "selected": {
                      "\u5929\u6d25\u5e02": true
                  },
                  "show": true,
                  "padding": 5,
                  "itemGap": 10,
                  "itemWidth": 25,
                  "itemHeight": 14
              }
          ],
          "tooltip": {
              "show": true,
              "trigger": "item",
              "triggerOn": "mousemove|click",
              "axisPointer": {
                  "type": "line"
              },
              "showContent": true,
              "alwaysShowContent": false,
              "showDelay": 0,
              "hideDelay": 100,
              "textStyle": {
                  "fontSize": 14
              },
              "borderWidth": 0,
              "padding": 5
          },
          "xAxis": [
              {
                  "show": true,
                  "scale": false,
                  "nameLocation": "end",
                  "nameGap": 15,
                  "gridIndex": 0,
                  "inverse": false,
                  "offset": 0,
                  "splitNumber": 5,
                  "minInterval": 0,
                  "splitLine": {
                      "show": false,
                      "lineStyle": {
                          "show": true,
                          "width": 1,
                          "opacity": 1,
                          "curveness": 0,
                          "type": "solid"
                      }
                  },
                  "data": [
                      "\u7b2c2019\u5e74",
                      "2018\u5e74",
                      "2017\u5e74",
                      "2016\u5e74",
                      "2015\u5e74",
                      "2014\u5e74"
                  ]
              }
          ],
          "yAxis": [
              {
                  "show": true,
                  "scale": false,
                  "nameLocation": "end",
                  "nameGap": 15,
                  "gridIndex": 0,
                  "inverse": false,
                  "offset": 0,
                  "splitNumber": 5,
                  "minInterval": 0,
                  "splitLine": {
                      "show": false,
                      "lineStyle": {
                          "show": true,
                          "width": 1,
                          "opacity": 1,
                          "curveness": 0,
                          "type": "solid"
                      }
                  }
              }
          ],
          "title": [
              {
                  "text": "\u5929\u6d25\u5e02GDP",
                  "subtext": "\u9009\u53d6\u5929\u6d25\u5e02GDP\u6570\u636e\u5bf9\u6bd4",
                  "padding": 5,
                  "itemGap": 10
              }
          ]
      };
      chart_c1a8906272f24c63bdc605afc19b3c61.setOption(option_c1a8906272f24c63bdc605afc19b3c61);
  </script>

{% endblock %}
